// Toast提示工具
class Toast {
    constructor() {
        console.log('Initializing Toast...');
        this.container = null;
        // 确保在 DOM 加载完成后再初始化
        if (document.readyState === 'loading') {
            document.addEventListener('DOMContentLoaded', () => this.init());
        } else {
            this.init();
        }
    }

    init() {
        try {
            // 检查是否已经存在容器
            if (document.getElementById('toastContainer')) {
                console.log('Toast container already exists');
                this.container = document.getElementById('toastContainer');
                return;
            }

            // 创建容器
            this.container = document.createElement('div');
            this.container.className = 'toast-container';
            this.container.id = 'toastContainer';
            document.body.appendChild(this.container);
            console.log('Toast container created');

            // 添加样式
            const style = document.createElement('style');
            style.textContent = `
                .toast-container {
                    position: fixed;
                    top: 20px;
                    right: 20px;
                    z-index: 9999;
                }

                .toast {
                    background: rgba(0, 0, 0, 0.8);
                    backdrop-filter: blur(10px);
                    border-radius: 8px;
                    padding: 12px 24px;
                    margin-bottom: 10px;
                    color: #fff;
                    font-size: 14px;
                    display: flex;
                    align-items: center;
                    gap: 8px;
                    transform: translateX(120%);
                    transition: all 0.3s ease;
                    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
                    min-width: 200px;
                }

                .toast.show {
                    transform: translateX(0);
                }

                .toast.success {
                    border-left: 4px solid #00ff88;
                }

                .toast.warning {
                    border-left: 4px solid #ffd700;
                }

                .toast.error {
                    border-left: 4px solid #ff4444;
                }

                .toast-icon {
                    font-size: 18px;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    width: 24px;
                    height: 24px;
                    border-radius: 50%;
                    background: rgba(255, 255, 255, 0.1);
                }

                .toast.success .toast-icon {
                    color: #00ff88;
                }

                .toast.warning .toast-icon {
                    color: #ffd700;
                }

                .toast.error .toast-icon {
                    color: #ff4444;
                }

                .toast-info .toast-icon {
                    color: #00b4d8;
                }
            `;
            document.head.appendChild(style);
            console.log('Toast styles added');
        } catch (error) {
            console.error('Error initializing Toast:', error);
        }
    }

    show(message, type = 'info') {
        try {
            // 确保容器存在
            if (!this.container) {
                this.init();
            }

            console.log('Showing toast:', { message, type });
            const toast = document.createElement('div');
            toast.className = `toast ${type}`;
            
            // 添加图标
            const icon = document.createElement('span');
            icon.className = 'toast-icon';
            switch(type) {
                case 'success':
                    icon.innerHTML = '✓';
                    break;
                case 'warning':
                    icon.innerHTML = '⚠';
                    break;
                case 'error':
                    icon.innerHTML = '✕';
                    break;
                default:
                    icon.innerHTML = 'ℹ';
                    type = 'info'; // 确保info类型正确应用
            }
            
            // 添加消息文本
            const text = document.createElement('span');
            text.textContent = message;
            
            toast.appendChild(icon);
            toast.appendChild(text);
            this.container.appendChild(toast);
            
            // 触发重排以启用动画
            toast.offsetHeight;
            toast.classList.add('show');
            
            // 3秒后移除提示
            setTimeout(() => {
                toast.classList.remove('show');
                setTimeout(() => {
                    this.container.removeChild(toast);
                }, 300);
            }, 3000);
        } catch (error) {
            console.error('Error showing toast:', error);
        }
    }

    success(message) {
        this.show(message, 'success');
    }

    warning(message) {
        this.show(message, 'warning');
    }

    error(message) {
        this.show(message, 'error');
    }

    info(message) {
        this.show(message, 'info');
    }
}

// 创建全局实例
console.log('Creating global Toast instance...');
window.toast = new Toast(); 